<template>
    <div>
        <div class="title_box">
          <div class="iconfont icon-left" @click="$router.go(-1)"></div>
          <div class="title">地址列表</div>
          <div></div>
        </div>
        <div class="list">
            <van-address-list
              v-model="chosenAddressId"
              :list="list"
              default-tag-text="默认"
              @add="onAdd"
              @edit="onEdit"
              @select="onSelect"
            />
        </div>
    </div>
</template>

<script>

export default {
  data() {
    return {
      chosenAddressId: '1',
      list: [
        {
          id: '1',
          name: '张三',
          tel: '13000000000',
          address: '浙江省杭州市西湖区文三路 138 号东方通信大厦 7 楼 501 室',
          isDefault: true,
        },
        {
          id: '2',
          name: '李四',
          tel: '1310000000',
          address: '浙江省杭州市拱墅区莫干山路 50 号',
        },
      ],
    };
  },
  methods: {
    onAdd() {
      this.$router.push("/AddressEdit")
    },
    onEdit(item, index) {
      this.$router.push({path:"/AddressEdit",query:this.list[index]})
      console.log(item)
    },
    onSelect(item){
      // console.log(item)
      this.$router.push({path:"/confirmation",query:item})
    }

  },
  created(){
      if(!this.$store.getters.getData.receiving){
          this.list.push(this.$store.getters.getData.receiving)
      }
      
  }
};
</script>

<style lang="less" scoped>
    .title_box {
      height: 47px;
      line-height: 47px;
      padding: 7px 0px;
      text-align: center;
      background: #fff;
      border-bottom: 1px solid #E8E8E8;
      display: flex;
      justify-content: space-around;
      div:nth-child(odd){
          flex: 1;
          font-size: 18px;
      }
      .title {
        flex: 6;
        font-size: 20px;
      }
    }
</style>